<template>
  <div class="">
    <div class="any_tanxing">
      <!-- <el-breadcrumb separator="/" >
                    <el-breadcrumb-item :to="{ path: '/index' }"><i class="fa fa-home"></i></el-breadcrumb-item>
                    <el-breadcrumb-item ><a>{{$store.state.title }}</a></el-breadcrumb-item>
                    <el-breadcrumb-item v-if="$store.state.showTitle2">{{$store.state.title2}}</el-breadcrumb-item>
                </el-breadcrumb> -->
      <div class="fx content-mbx">
        <div>
          <span @click="$router.push('/index')" class="content-mbx-active">首页</span>
        </div>
        <div>
          &nbsp;-&nbsp;<span class="content-mbx-active" @click="gotohref">{{
            $store.state.title
          }}</span>
        </div>
        <div v-if="$store.state.showTitle2">
          &nbsp;-&nbsp;<span class="content-mbx-active">{{
            $store.state.title2
          }}</span>
        </div>

        <div v-for="(item, i) in $store.state.breadcrumbs" :key="i" @click="breadclick(item, i)">
          &nbsp;-&nbsp;<span class="content-mbx-active">{{ item.title }}</span>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data () {
    return {
      i: 0,
      isBg: true
    };
  },
  methods: {
    breadclick (item, i) {
      var arr = this.$store.state.breadcrumbs;
      this.$store.commit("setbreadcrumbs", arr.slice(0, i + 1));
      this.$router.replace(item.url);
    },
    gotohref () {
      if (this.$store.state.breadcrumbs && this.$store.state.breadcrumbs[0]) {
        console.log(this.$store.state.breadcrumbs[0].url);
        this.$router.replace(this.$store.state.breadcrumbs[0].beforeurl);
        this.$store.commit("setbreadcrumbs", []);
      }
    },
  },
  watch: {
    isbg () {
      this.isBg = false;
    }
  }
};
</script>
